<style lang="less" scoped src="./major.less"></style>
<style>
    td.ivu-table-expanded-cell{
        padding: 1px 1px;
    }
</style>
<script src="./major.js"></script>

<template>
    <div>
        <Row style="font-size: 15px;">
            <Col span="22">
            专业名称：<Input v-model="query.name" clearable style="width: 15%"></Input>
            所属科目：
            <Select v-model="query.subjectid" clearable style="width: 15%">
                <Option v-for="item in subjectList" :value="item.id" :key="item.id">{{item.name}}</Option>
            </Select>
            <span @click="loadList"><Button type="primary" icon="android-search">查询</Button></span>
            <span @click="refresh"><Button type="primary" icon="refresh">清空</Button></span>
            </Col>
            <Col span="2">
            <span @click="showAdd"><Button type="primary" icon="android-add">新增</Button></span>
            </Col>
        </Row>
        <div class="main-table">
            <Table :columns="columns" :data="data" @on-expand="onExpand"></Table>
        </div>
        <div class="pagination">
            <Page :total="total" size="small" :page-size="pageSize" :current.sync="pageIndex" @on-change="loadList"
                  show-total show-elevator></Page>
        </div>
        <Modal v-model="editModal"
               :title="editTitle"
               width="60%"
               :mask-closable="false"
               @on-cancel="editModal = false">
            <Form :model="formData" :label-width="100">
                <Row>
                    <Col span="12">
                    <FormItem label="上级专业">
                        <Input v-model="formData.parentname" :readonly="true"></Input>
                    </FormItem>
                    </Col>
                    <Col span="12">
                    <FormItem label="专业名称">
                        <Input v-model="formData.name" :clearable="!isRead.name" :readonly="isRead.name"></Input>
                    </FormItem>
                    </Col>
                </Row>
                <Row>
                    <Col span="12">
                    <FormItem label="专业代码">
                        <Input v-model="formData.code" :clearable="!isRead.code" :readonly="isRead.code"></Input>
                    </FormItem>
                    </Col>
                    <Col span="12">
                    <FormItem label="专业科目">
                        <Select v-model="formData.subjectid" :clearable="!isRead.subjectid" :disabled="isRead.subjectid">
                            <Option v-for="item in subjectList" :value="item.id" :key="item.id">{{item.name}}</Option>
                        </Select>
                    </FormItem>
                    </Col>
                </Row>
                <Row>
                    <Col span="12">
                    <FormItem label="排序">
                        <Input v-model="formData.orders" :clearable="!isRead.orders" :readonly="isRead.orders"></Input>
                    </FormItem>
                    </Col>
                    <Col span="12">
                    <FormItem label="是否启用">
                        <Select v-model="formData.status" :clearable="!isRead.status" :disabled="isRead.status">
                            <Option v-for="item in selectYesOrNo" :value="item.id" :key="item.id">{{item.name}}</Option>
                        </Select>
                    </FormItem>
                    </Col>
                </Row>
                <Row>
                    <Col span="12">
                    <FormItem label="是否限制报名">
                        <Select v-model="formData.issginup" :clearable="!isRead.issginup" :disabled="isRead.issginup">
                            <Option v-for="item in selectYesOrNo" :value="item.id" :key="item.id">{{item.name}}</Option>
                        </Select>
                    </FormItem>
                    </Col>
                    <Col span="12">
                    </Col>
                </Row>
            </Form>
            <div slot="footer">
                <Button type="primary" @click="save">保存</Button>
                <Button type="ghost" style="margin-left: 8px" @click="editModal = false">取消</Button>
            </div>
        </Modal>
        <Modal v-model="bookModal"
               title="教材设置"
               width="60%"
               :mask-closable="false">
            <book-list ref="book" :ids="bookids"></book-list>
            <div slot="footer">
                <Button type="primary" @click="saveBook">保存</Button>
                <Button type="ghost" style="margin-left: 8px" @click="bookModal = false">取消</Button>
            </div>
        </Modal>
    </div>
</template>